<template>
  <div id="main"></div>
</template>

<script>
import * as echarts from 'echarts/core';
export default {
    mounted() {
        this.drawLine();
    },
    methods: {
        drawLine() {
        // 基于准备好的dom，初始化echarts实例
            var chartDom = document.getElementById('main');
            var myChart = echarts.init(chartDom);
            var option;
        // 绘制图表
        option = {
            graphic: {
                elements: [
                    {
                        type: 'text',
                        
                        top: 'center',
                        style: {
                        text: '数据分析',
                        fontSize: 70,
                        fontWeight: 'bold',
                        lineDash: [0, 200],
                        lineDashOffset: 0,
                        fill: 'transparent',
                        stroke: '#000',
                        lineWidth: 1
                        },
                        keyframeAnimation: {
                        duration: 3000,
                        loop: false,
                        keyframes: [
                            {
                            percent: 0.7,
                            style: {
                                fill: 'transparent',
                                lineDashOffset: 200,
                                lineDash: [200, 0]
                            }
                            },
                            {
                            // Stop for a while.
                            percent: 0.8,
                            style: {
                                fill: 'transparent'
                            }
                            },
                            {
                            percent: 1,
                            style: {
                                fill: 'white'
                            }
                            }
                        ]
                        }
                    }
                ]
            }
        };
        option && myChart.setOption(option);
    }
  }

}
</script>

<style>

</style>






